<div class="issue-watch container-fluid">

  <div class="row">
    <div class="list-toolbar col-xl-12">
      <div class="title">
        <span>关注问题</span>
      </div>
      <div class="filter">
      </div>
      <div class="buttons">
        <button (click)="cancel()" type="button" class="btn btn-secondary btn-with-icon btn-sm">
          <i class="fa fa-plus-circle"></i>返回
        </button>
      </div>
    </div>
  </div>

  <div class="row">
    <div class="my-validate-form">

      <div class="form-group row">
        <label class="col-2 col-form-label"><span>用户组/用户名/邮箱</span></label>
        <div class="col-10">
          <search-select [(searchModel)]="searchModel" [searchResult]="searchResult"
                         [(selectedModels)]="selectedModels" (searchChange)="changeSearch($event)">
          </search-select>
        </div>
      </div>

      <div class="form-group row">
        <label class="col-2 col-form-label"></label>
        <div class="col-10">
          <button (click)="batchWatch()" [disabled]="selectedModels.length == 0" type="button" class="btn btn-primary">添加</button>
        </div>
      </div>

    </div>
  </div>

  <div class="row table-container">
    <table class="table table-bordered table-hover th-bolder">
      <thead>
      <tr>
        <th>昵称</th>
        <th>邮箱</th>
        <th>操作</th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let item of users">
        <td>{{ item.nickname }}</td>
        <td>{{ item.email }}</td>
        <td>
          <span (click)="remove(item)" class="link">移除</span>
        </td>
      </tr>
      </tbody>
    </table>
  </div>
</div>
